<script setup>
    import { ref, computed } from 'vue';
    const firstName = ref('John');
    const lastName = ref('Doe');

    const fullName = computed({
        get() {
            return `${firstName.value} ${lastName.value}`;
        },
        set(newValue){
            [firstName.value, lastName.value] = newValue.split(' ');
        },
    });
</script>

<template>
    <h1>可写计算属性</h1>
    FirstName: <input v-model="firstName" /> &nbsp;&nbsp;
    LastName: <input v-model="lastName" />

    Now FullName is {{ fullName }}
</template>
